import React from 'react'
import { Card, Form, Input, Button, message, Icon, Checkbox } from 'antd';
import './ui.less'
const FormItem = Form.Item
class Login extends React.Component {
    handleSubmit = () => {
        var userInfo = this.props.form.getFieldsValue();
        this.props.form.validateFields((err, values) => {
            if (!err) {
                message.success(`${userInfo.userName} ok,密码:${userInfo.userPwd}`)
            }
        })
    }
    render() {
        const { getFieldDecorator } = this.props.form;
        return (
            <div>
                <Card title='登录'>
                    <Form className="login-form">
                        <FormItem>
                            {
                                getFieldDecorator('userName',
                                    {
                                        initialValue: '', rules: [
                                            { required: true }
                                        ]
                                    })(<Input placeholder='输入账号'></Input>)
                            }
                        </FormItem>
                        <FormItem>
                            {
                                getFieldDecorator('userPwd',
                                    { initialValue: '', rules: [] })(<Input placeholder='输入账号'></Input>)
                            }
                        </FormItem>
                        <FormItem>
                            <Button type='primary' onClick={this.handleSubmit}>提交</Button>
                        </FormItem>
                    </Form>
                </Card>
                <Card title='登录水平表单'>
                    <Form></Form>
                </Card>
            </div>
        )
    }
}
export default Form.create({})(Login)